<script lang="ts" setup>
import ProductBox from "../Common/ProductBox.vue";
import Tip from "../Common/Tip.vue";

import { reactive, ref } from "vue";

const radio = ref(3);

const formLabelAlign = reactive({
  name: "",
  region: "",
  type: "",
});

const submit = () => {
  console.log("submit");
};
</script>
<template>
  <div class="pl-5 pr-5">
    <ProductBox title="申请提现" :back="true">
      <div class="w-full">
        <Tip :show-icon="false" class="mb-5">
          <p>说明：</p>
          <p class="mb-0">
            根据《中华人民共和国发票管理办法实施细则》（国家税务总局令第37号）第二十八条规定：“单位和个人在开具发票时，必须做到按照号码顺序填开，
            <span class="text-red-600">
              填写项目齐全，内容真实，字迹清楚，全部联次一次打印，内容完全一致，并在发票联和抵扣联加盖发票专用章
            </span>
            ”。未按该办法开具的发票我司有权拒收。
          </p>
        </Tip>
      </div>

      <div class="flex flex-col items-center">
        <p>
          <span>可提现金额：</span>
          <span class="text-amber-700 font-bold text-lg">0 元</span>
        </p>

        <el-form label-width="auto" :model="formLabelAlign" style="max-width: 800px" :label-position="'top'">
          <el-form-item label="提现金额">
            <p>
              <el-input v-model="formLabelAlign.name" class="w-80 max-h-10" />
              <span class="ml-3">单位：元（最小金额）为1元，必须为整数</span>
            </p>
          </el-form-item>
          <el-form-item label="支付宝实名">
            <el-input v-model="formLabelAlign.region" />
          </el-form-item>
          <el-form-item label="支付宝账户">
            <el-input v-model="formLabelAlign.type" />
            <p>支付宝实名认证必须与平台实名一致，否者将无法提现。</p>
          </el-form-item>

          <el-form-item>
            <p class="w-full">
              <span>到账金额：</span>
              <span class="text-amber-700">-元</span>
            </p>
            <p class="text-amber-500">
              您需要给平台开具-元发票，方可完成提现，请在下方提交发票
            </p>
          </el-form-item>

          <el-form-item>
            <div class="flex flex-col">
              <p>开票信息</p>
              <p>名称：徐州计算有限公司</p>
              <p>纳税人识别号：91440300MA5GBFEW2X</p>
              <p>
                地址：徐州市南山区粤海街道高新区社区白石路3609号徐州湾科技生态园二区9栋B908
              </p>
              <p>电话：0755-86951806 开户行：招商银行徐州分行创维大厦支行</p>
              <p>账号：755951553710802</p>
            </div>
          </el-form-item>
          <el-form-item>
            <el-radio-group v-model="radio">
              <el-radio :value="3">电子发票</el-radio>
              <el-radio :value="6">纸质发票</el-radio>
            </el-radio-group>
          </el-form-item>

          <el-form-item>
            <a-button @click="submit" type="primary">申请</a-button>
          </el-form-item>
        </el-form>
      </div>
    </ProductBox>
  </div>
</template>
<style lang="scss" scoped></style>
